<template>
  <view class="bg-box">
    <view v-for="(item, index) in 7" :key="index">
      <image class="share-img" :src="'/static/yibang-images/'+ (index+ 1) +'.jpg'" mode="widthFix"></image>
    </view>
    <view class="placeholder"></view>
    <view class="button-box">
      <view class="flex justify-center button-wrap">
        <view @click="share_flag = true" class="button flex align-center justify-center">分享艺一帮</view>
      </view>
    </view>
    <!--分享框-->
    <shareDialog :share_flag="share_flag" :herf="'shareApp'"
                 :article_title="'艺一帮'"
                 :intro="'我有一个非常好的APP分享给你'"
                 @handleCloseShareDialog="handleCloseShareDialog"></shareDialog>
  </view>
</template>

<script>
import shareDialog from "components/share-dialog/share-dialog";

export default {
  components: {
    shareDialog
  },
  data() {
    return {
      share_flag: false,
    }
  },
  methods: {
    //关闭分享模态框
    handleCloseShareDialog() {
      this.share_flag = false;
    },
  }
}
</script>

<style scoped lang="scss">
.placeholder {
  width: 100%;
  height: 200upx;
}

.share-img {
  width: 100%;
}

.bg-box {
  width: 100%;
  min-height: 100vh;
  background-color: rgba(248, 248, 248, 1);
  padding: 20upx 18upx;
}

.bg-box image {
  display: block;
}

.button-box {
  position: fixed;
  bottom: 56upx;
}

.button-wrap {
  width: 100%;
  padding: 0 76upx;
}

.button {
  width: 596upx;
  height: 80upx;
  border-radius: 40upx;
  font-size: 28upx;
  color: #FFFFFF;
  background-color: rgba(229, 39, 24, 1);
}
</style>
